<!--
 * @Author: your name
 * @Date: 2021-01-06 16:04:18
 * @LastEditTime: 2021-01-07 17:10:34
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \solaxcloud\src\views\test\frame\frameTest.vue
-->
<template>
    <div class="frameTest-mian-box">
        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane :label="$t('device.inverter.js_real_time_Display')" name="first">
                <nowData></nowData>
            </el-tab-pane>
            <el-tab-pane :label="$t('test.deviceTest.real_time.history')" name="second">
                <historyData></historyData>
            </el-tab-pane>
            <el-tab-pane :label="$t('test.deviceTest.real_time.historyChart')" name="third">
                <historyChart v-if='activeName == "third"'></historyChart>
            </el-tab-pane>
            <el-tab-pane :label="$t('test.deviceTest.real_time.historyAlarm')" name="fourth">
                <alarmData></alarmData>
            </el-tab-pane>
        </el-tabs>
        <el-button size='small' type="primary" icon="el-icon-caret-left" :title="$t('edit')" @click='returnOldView' class="returnOldView">{{$t('back')}}</el-button>
    </div>
</template>

<script>
import nowData from './nowData'
import historyData from './historyData'
import historyChart from './historyChart'
import alarmData from './alarmData.vue'
export default {
    components: {
        nowData,
        historyData,
        historyChart,
        alarmData
    },
    props: {

    },
    data() {
        return {
            activeName:'first'
        };
    },
    computed: {

    },
    watch: {

    },
    created() {

    },
    mounted() {

    },
    methods: {
        handleClick(tab, event) {
            console.log(tab, event);
        },
        returnOldView(){
            this.$router.push({path:this.$route.query.oldPath})
        }
    },
};
</script>

<style  lang="less" scoped>
.frameTest-mian-box{
    position: relative;
    .returnOldView{
        position: absolute;
        top: 0px;
        right: 0px;
    }
}
</style>
